<template>

	<div class="index zhuanqian">
		<div class="header">
			<span class="logo"><img style="width: 1.5rem;margin: .25rem .32rem;" src="http://liangzhong.oss-cn-hangzhou.aliyuncs.com/newwap/shouye/logo_1.png" @click="zhuye()"/></span>
			<div class="seach-box" @click="seachStuta==true&&seachbtn()">
				<i class="seachimg"><img style="width: .24rem;margin-left: 1.51rem;margin-right: .13rem;float: left;margin-top: .19rem;" src="http://liangzhong.oss-cn-hangzhou.aliyuncs.com/newwap/shouye/icon_search@2x.png"/></i>
				<span v-show="seachshow">搜索商品</span>
				<form action="javascript:;" v-show="seachinput">
					<input type="search" name="" id="seach" value="" v-model="seachvalue" placeholder="搜索商品" @keyup.enter="seachsend" autofocus="autofocus" />
				</form>
	
			</div>
			<router-link :to="nt_user!=0?'/informationlist':'/login'" class="xiaoxi" v-show="!seachrmshow"><img style="width: .44rem;" src="http://liangzhong.oss-cn-hangzhou.aliyuncs.com/newwap/shouye/xiaoxi.png" /><span id="xmessage"></span></router-link>
			<span class="qxsousuo dasousuo" v-show="seachrmshow" @click="seachremove()">取消</span>
		</div>
		<img style="margin-top: 0.9rem;" src="http://liangzhong.oss-cn-hangzhou.aliyuncs.com/newwap/img/hehuoren.jpg" />		
	</div>
</template>

<script>
	var furl = 'http://www.ntyouxuan.com/';
	export default{
		name:"money",
		data () {
			return{
				ind:0,
				seachshow:true,
				seachStuta: true,
				seachinput: false,
				arealist:[],
				seachvalue:'',
				seachrmshow:false,
				wxdata:{
					'appid':'',
					'timestamp':'',
					'wxnonceStr':'',
					'wxShal':'',
					'title':'',
					'title_desc':'',
					'link':'',
					'img_url':'', 
				},
				aurl:''
			}
		},
		methods:{
			isWeiXin() {
		      let ua = window.navigator.userAgent.toLowerCase();
		      //mozilla/5.0 (iphone; cpu iphone os 9_1 like mac os x) applewebkit/601.1.46 (khtml, like gecko)version/9.0 mobile/13b143 safari/601.1
		      if (ua.match(/MicroMessenger/i) == 'micromessenger') {
		      return true;
		      } else {
		      return false;
		      }
		    },
		    seachbtn: function () {
		      var self = this
		      var b = 0
		      for (var i = 151; i > 20; i--) {
		        (function (i) {
		          var a = i
		          setTimeout(function () {
		            $('.seachimg img').css('margin-left', a / 100 + 'rem')
		            if (i <= 21) {
		              self.seachshow = false
		              self.seachinput = true
		              self.seachrmshow = true
		              setTimeout(function () {
		                document.getElementById('seach').focus()
		              }, 100)
		              self.seachStuta = false
		            }
		          }, 1 * b)
		          b++
		        })(i)
		      }
		    },
		    
		    seachremove: function () {
			// 当点击搜索时的动画
		      this.seachinput = false
		      var self = this
		      self.seachrmshow = false
		      setTimeout(function () {
		        self.seachshow = true
		        $('.seachimg img').css('margin-left', 151 / 100 + 'rem')
		        self.seachStuta = true;
		      }, 100)
		    },
		    seachsend:function(){
		    	var self=this;
		    	localStorage.setItem("nt_keyword",self.seachvalue);
		    	this.$router.push({path:'/seachall'});
		    },
			zhuye: function() {
				window.location.href = 'http://www.ntyouxuan.com/newnt/#/';
			},
			seachsend:function(){
		    	var self=this;
		    	localStorage.setItem("nt_keyword",self.seachvalue);
		    	this.$router.push({path:'/seachall'});
		    },
			seachsendtow:function(data){
		  		localStorage.setItem("nt_keyword",data);
		  		this.seachremove();
		    	var self=this;
		    	self.seachrmshow=false;
				  setTimeout(function () {
				  	self.$router.push({path:'/seachall'});
				  }, 150);
		  	},
		},
		mounted:function(){
		    var self=this;
		 	$.ajax({
				type: "get",
				url: furl + "index.php?app=ajax&act=new_message",
				dataType: 'json',
				success: function(res) {
					self.xiaoxitx=res.retval.new_message;
					if(self.xiaoxitx == 0){
						$("#xmessage").css("display","none")
					}
					console.log(self.xiaoxitx);
				}
			});
		}
	}
</script>

<style>
	.zhuanqian{
		width: 100%;
		height: auto;
	}
	.zhuanqian img{
		width: 100%;
		height: auto;
		float: left;
	}
</style>